<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String ctxPath = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ ctxPath + "/";
	String SYSTEM_NAME = "EZMES";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title><%=SYSTEM_NAME%></title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link href="<%=basePath %>css/bootstrap.min.css?v=3.4.0" rel="stylesheet">
<link href="<%=basePath %>css/font-awesome.min.css?v=4.3.0" rel="stylesheet">

<!-- Data Tables -->
<link href="<%=basePath %>css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
<link href="<%=basePath %>css/animate.min.css" rel="stylesheet">
<link href="<%=basePath %>css/style.min.css?v=3.0.0" rel="stylesheet">
</head>
<body>
<table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">
	<thead>
	    <tr>
	        <th>Name</th>
	        <th>Position</th>
	        <th>Office</th>
	        <th>Extn.</th>
	        <th>Start date</th>
	        <th>Salary</th>
	    </tr>
	</thead>
</table>




<!-- 全局js -->
<script src="<%=basePath %>js/jquery-2.1.1.min.js"></script>
<script src="<%=basePath %>js/bootstrap.min.js?v=3.4.0"></script>
<script src="<%=basePath %>js/plugins/jeditable/jquery.jeditable.js"></script>
<!-- Data Tables -->
<script src="<%=basePath %>js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="<%=basePath %>js/plugins/dataTables/dataTables.bootstrap.js"></script>
<!-- 自定义js -->
<script src="<%=basePath %>js/content.min.js?v=1.0.0"></script>
</body>
<script type="text/javascript">
var oTable;
$(function(){
	initDataTables();
});
function initDataTables(){
	oTable=$('#dataTable').dataTable( {
		"sDom": '<"top"<"toolbar">f<"clear">>rt<"bottom"lpi<"clear">>',
		"bPaginate": true,
		"bProcessing": true,
		"bServerSide": true,
		"bAutoWidth": false,
		"bRetrieve": true,
		"bDestroy": true,
		"sAjaxSource": $('#baseUrl').attr("href")+"usersAction_query_allUsers",//URL
		"fnServerData": retrieveData,
		"aoColumnDefs": [{ "bVisible": false, "aTargets": [0]}],//隐藏列
		"aaSorting": [[ 0, "desc" ]],//指定排序的列 默认是第0列 升序
		"aoColumns": [
			{ "mDataProp": "uid"},
			{ "mDataProp": "ushowname" },
			{ "mDataProp": "uname" },
			{ "mDataProp": "ustatus",
			  "fnRender" : function(oObj) {
				  if(oObj.aData.ustatus==1){
					  return '<span class="label label-success arrowed-in arrowed-in-right">正常</span>';
				  }else{
					  return '<span class="label label-important arrowed">锁定</span>';
				  }
				}
			},
			{ "mDataProp": "roles",
			  "bSortable": false,
			  "fnRender" : function(oObj) {
				  var roleStr="";
				  if(oObj.aData.roles!=null){
					  $.each(oObj.aData.roles,function(k1,v1){
						  roleStr= roleStr + " "+v1.rname;
					  });
				  }
				  return roleStr + '  <a class="btn btn-mini btn-primary" href="javascript:setUserRole(\''+oObj.aData.uid+'\')"><i class="icon-cogs"></i></a>';
				}
			}
		],
		"sPaginationType": "full_numbers",      //翻页界面类型   
		"oLanguage": {							//汉化 也可以写到oLanguage里面
			"sUrl": "<%=basePath%>assets/js/jquery.data.table.cn.txt"
		},
		"error": function (xhr, error, thrown) {//暂时还没用到
		    if ( error == "parsererror" ) {  
		        oSettings.oApi._fnLog( oSettings, 0, "DataTables warning: JSON data from " + "server could not be parsed. This is caused by a JSON formatting error." );  
		    } 
		},
		"fnDrawCallback": function () {
			//行选中绑定
	         var that = this;
	        this.$('tr').click( function( e ) {
	            if ( $(this).hasClass('row_selected') ) {
	                $(this).removeClass('row_selected');
	                this.rowIndex%2?$(this).addClass('odd'):$(this).addClass('even');
	            }
	            else {
		            var selRow = that.$('tr.row_selected');
		            selRow.removeClass('row_selected');
		            //this.rowIndex%2?$(this).removeClass('odd'):$(this).removeClass('even');
	                $(this).addClass('row_selected');
	            }
	        } );

	        $("div.toolbar").html($("#table_toolBar_template").html());
	    }
	} );
}
</script>
</html>
